<template>
  <MainLayout>
    <div class="p-12">
      <h2 class="text-lg font-600 mb-2">预拌混凝土施工记录表</h2>

      <div class="grid grid-cols-2 gap-3">
        <n-input v-model:value="form.projectName" placeholder="工程名称" />
        <n-input v-model:value="form.weather" placeholder="天气" />
        <n-input v-model:value="form.temperature" placeholder="温度，如 8-13" />
        <n-input v-model:value="form.pageNo" placeholder="页码" type="number" />
        <n-input v-model:value="form.supplyUnit" placeholder="砼浇筑部位（构件、标高及构件名称）" />
        <n-input v-model:value="form.designStrength" placeholder="砼设计强度，如 45" />
        <n-input v-model:value="form.mixPlant" placeholder="拌和站名称" />
        <n-input v-model:value="form.contactPhone" placeholder="联系电话" />
        <n-date-picker v-model:value="form.pouringDateStart" type="datetime" placeholder="浇筑开始时间" />
        <n-date-picker v-model:value="form.pouringDateEnd" type="datetime" placeholder="浇筑结束时间" />
        <n-input v-model:value="form.slump" placeholder="坍落度，例：234 mm" />
        <n-input v-model:value="form.continuousTime" placeholder="连续浇筑总工时" />
        <n-input v-model:value="form.initialSetting" placeholder="初凝时间，如 4小时" />
        <n-input v-model:value="form.cubeStrength" placeholder="配合比试块推荐强度，如 45" />
      </div>

      <n-divider>搅拌运输车编号</n-divider>
      <div v-for="(no,i) in form.truckNos" :key="i" class="flex gap-2 mb-2">
        <n-input v-model:value="form.truckNos[i]" placeholder="车号" />
        <n-button size="small" @click="removeTruck(i)">删除</n-button>
      </div>
      <n-button size="small" @click="addTruck">+ 添加车号</n-button>

      <n-divider>检查事项</n-divider>
      <div v-for="(it,i) in form.checklist" :key="i" class="grid grid-cols-12 gap-2 mb-2">
        <n-input v-model:value="it.no" class="col-span-1" placeholder="序号" />
        <n-input v-model:value="it.title" class="col-span-7" placeholder="事项" />
        <n-input v-model:value="it.result" class="col-span-3" placeholder="结论" />
        <n-button size="small" @click="form.checklist.splice(i,1)">删除</n-button>
      </div>
      <n-button size="small" @click="form.checklist.push({no: form.checklist.length+1,title:'',result:''})">
        + 添加检查项
      </n-button>

      <n-divider>取样/试块</n-divider>
      <div class="grid grid-cols-4 gap-2">
        <n-input-number v-model:value="form.samplingTimes" :min="0" placeholder="取样次数" />
        <n-input-number v-model:value="form.cubeGroupsCurr" :min="0" placeholder="同条件试块(当前)组" />
        <n-input-number v-model:value="form.cubeGroupsMid" :min="0" placeholder="其中中等强度组" />
        <n-input-number v-model:value="form.cubeGroupsSpl" :min="0" placeholder="拆模同条件组" />
        <n-input v-model:value="form.rebarValue" placeholder="抗渗试块" />
      </div>

      <div class="mt-2">
        <div v-for="(v,i) in form.samplingValues" :key="i" class="flex gap-2 mb-1">
          <n-input-number v-model:value="form.samplingValues[i]" :min="0" placeholder="检验值" />
          <n-button size="small" @click="form.samplingValues.splice(i,1)">删除</n-button>
        </div>
        <n-button size="small" @click="form.samplingValues.push(null)">+ 添加检验值</n-button>
      </div>

      <n-divider>其他</n-divider>
      <n-input v-model:value="form.inspectorOpinion" type="textarea" placeholder="检查落实情况说明" />
      <div class="grid grid-cols-3 gap-2 mt-2">
        <n-input v-model:value="form.recorder" placeholder="记录人" />
        <n-switch v-model:value="form.isTrue"><template #checked>真实</template><template #unchecked>否</template></n-switch>
      </div>

      <div class="mt-4 flex gap-2">
        <n-button type="primary" @click="onSave">保存</n-button>
        <n-button @click="onExport" :disabled="!form.id">导出 PDF</n-button>
      </div>
    </div>
  </MainLayout>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { rmc } from '@/services/api'
import MainLayout from '@/layouts/MainLayout.vue'
import { useMessage } from 'naive-ui'

const message = useMessage()
const route = (uni as any).getCurrentPages?.() ? (uni.getCurrentPages().pop() as any)?.options : {}
const projectId = Number(route?.project_id || 0)

const form = ref<any>({
  id: null,
  projectId,
  projectName: '',
  weather: '', temperature: '', pageNo: 1,
  supplyUnit: '', designStrength: '', mixPlant: '', contactPhone: '',
  pouringDateStart: null, pouringDateEnd: null, slump: '', continuousTime: '',
  initialSetting: '', cubeStrength: '',
  truckNos: [], checklist: [],
  samplingTimes: 0, samplingValues: [],
  cubeGroupsCurr: 0, cubeGroupsMid: 0, cubeGroupsSpl: 0, rebarValue: '',
  inspectorOpinion: '', recorder: '', isTrue: true
})

async function onSave(){
  const payload = { ...form.value }
  // 日期转 ISO 字符串（与你项目后端常用格式一致）
  if(payload.pouringDateStart) payload.pouringDateStart = new Date(payload.pouringDateStart).toISOString()
  if(payload.pouringDateEnd)   payload.pouringDateEnd   = new Date(payload.pouringDateEnd).toISOString()
  const { id } = await rmc.save(payload)
  if(id) form.value.id = id
  message.success('已保存')
}

async function onExport(){
  const blob = await rmc.exportPdf(form.value.id, form.value.projectName)
  const url = URL.createObjectURL(blob)
  const a = document.createElement('a')
  a.href = url; a.download = `预拌混凝土施工记录_${form.value.id}.pdf`
  a.click(); URL.revokeObjectURL(url)
}

function addTruck(){ form.value.truckNos.push('') }
function removeTruck(i:number){ form.value.truckNos.splice(i,1) }
</script>

<style scoped>
.p-12{ padding:12px; }
</style>
